package com.abc.robot01.activity.compose

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyGridItemScope
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.itemsIndexed
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Card
import androidx.compose.runtime.Composable
import androidx.compose.runtime.MutableState
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.abc.robot01.activity.MYBLACK_Percent5
import com.abc.robot01.activity.MYBLUE
import com.abc.robot01.activity.px
import com.abc.robot01.retrofit.bean.Item8
import com.bumptech.glide.integration.compose.ExperimentalGlideComposeApi

class LazyVerticalGridDemo : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            var isSelected = remember { mutableStateOf(false) }
            val scrollState = rememberScrollState()
            Column(
                modifier = Modifier
                    .fillMaxSize()
            ) {
                GridDemo()
//                Button(onClick = { /*TODO*/ }) {
//                    Text(text = "你好")
//                }
//                TwoStateButtonExample1(isSelected,"简约")
                Spacer(modifier = Modifier.height(2.dp))
//                TwoStateButtonExample1(isSelected,"现代")
//                FilterChipExample()
                Spacer(modifier = Modifier.height(2.dp))
                Spacer(modifier = Modifier.height(2.dp))
                Spacer(modifier = Modifier.height(2.dp))
            }
        }
    }

}

    @OptIn(ExperimentalGlideComposeApi::class)
    @Composable
    fun LazyGridItemScope.ImageTextCard(item: String, ) {
        // Background color changes based on the selected state
        val backgroundColor =  MYBLUE
        Card(
            colors = androidx.compose.material3.CardDefaults.cardColors(
                containerColor = backgroundColor // 设置背景色为红色
            ),
            shape = RoundedCornerShape(14.px),
            modifier = Modifier
                .clickable {

                }
                .background(Color.Transparent).fillMaxWidth()
                .width(500.px)
        ) {
//            Column(
//                modifier = Modifier
//                    .align(Alignment.CenterHorizontally)
//                    .fillMaxSize()
//                    .padding(20.px),
//                horizontalAlignment = Alignment.Start
//            ) {
//                Card(
//                    colors = androidx.compose.material3.CardDefaults.cardColors(
//                        containerColor = MYBLACK_Percent80 // 设置背景色为红色
//                    ),
//                    shape = RoundedCornerShape(10.px),
//                    modifier = Modifier
//                        .background(Color.Transparent)
//                        .width(209.px)
//                        .height(209.px)
//                ) {
//                    GlideImage(
//                        model = item.thumbnail,
//                        contentDescription = "",
//                        modifier = Modifier
//                            .align(Alignment.CenterHorizontally)
//                            .size(171.px, 220.px)
//                        ,
//                    )
//                }
//                Spacer(modifier = Modifier.height(10.px))
//                BasicText(
//                    maxLines = 1,
//                    overflow = TextOverflow.Clip,
//                    text = item.name?:"无名称",
//                    style = TextStyle(
//                        fontSize = (24 / 3.5f).sp,
//                        color = Color.Black,
//                        lineHeight = (24 / 3.5f).sp
//                    )
//                )
//                Spacer(modifier = Modifier.height(5.px))
//
//                Row(modifier = Modifier.fillMaxWidth()) {
//                    BasicText(
//                        maxLines = 1,
//                        overflow = TextOverflow.Clip,
//                        text = "" + item.houseType,
//                        style = TextStyle(
//                            fontSize = (20 / 3.5f).sp,
//                            color = MYBLACK_Percent60,
//                            lineHeight = (24 / 3.5f).sp
//                        )
//                    )
//                    Spacer(modifier = Modifier.weight(14f))
//                    BasicText(
//                        maxLines = 1,
//                        overflow = TextOverflow.Clip,
//                        text = "" + item.innerArea + "㎡",
//                        style = TextStyle(
//                            fontSize = (20 / 3.5f).sp,
//                            color = MYBLACK_Percent60,
//                            lineHeight = (24 / 3.5f).sp
//                        )
//                    )
//                }
//            }

//            GlideImage(
//                model = item.thumbnail,
//                contentDescription = "",
//                modifier = Modifier
//                    .align(Alignment.CenterHorizontally)
//                    .size(171.px, 220.px)
//                ,
//            )


        }
    }

    @Composable
    fun GridDemo() {
        // Sample data for demonstration
        val itemsList = List(50) { "Item $it" }
        // Container width set to 1860dp
            LazyVerticalGrid(
                verticalArrangement = Arrangement.spacedBy(20.px), // 可以设置垂直间隔，例如16dp
                horizontalArrangement = Arrangement.spacedBy(20.px), // 水平间隔设置为 20px
                columns = GridCells.Fixed(7), // 7 columns in the grid
                modifier = Modifier.width(1800.px)
                .height(592.px).
                background(Color.Red),
                contentPadding = PaddingValues(8.dp)
            ) {
                itemsIndexed(itemsList) { index,item ->
                    ImageTextCard(item)
                }
            }
        }
//}

